<template>
  <div class="browsing">
    <el-row>
      <el-col :span="6">
        <el-date-picker v-model="time" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
          :default-value="[new Date(2010, 9, 1), new Date(2010, 10, 1)]" format="YYYY/MM/DD" value-format="x" />
      </el-col>
      <el-col :span="5">
        <el-button color="#6675FF" :icon="Search" @click="timeclick">查询</el-button>
      </el-col>
    </el-row>
    <div style="margin: 30px 0;">
      <el-table :data="tableData" border style="width: 100%" :header-cell-style="{ color: '#333' }">
        <el-table-column prop="date" label="公告类型" width="180" align="center" />
        <el-table-column prop="name" label="标题信息" align="center" />
        <el-table-column prop="name" label="所属行业" width="200" align="center" />
        <el-table-column prop="date" label="查看时间" width="200" align="center" />
      </el-table>
    </div>
    <Pagination ref="pagination" :talet="talet"/>
  </div>
</template>

<script setup>
import { Search } from "@element-plus/icons-vue";
import Pagination from './pagination/index.vue'
import { ref } from "vue";
let time = ref([])
let pagination = ref()
let talet = ref('')
const tableData = [
  {
    date: '2016-05-03',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-02',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-04',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
  {
    date: '2016-05-01',
    name: 'Tom',
    address: 'No. 189, Grove St, Los Angeles',
  },
]

const timeclick = () => {
  // pagination.value.currentPage
  // pagination.value.pageSize
}
</script>

<style lang="scss" scoped>
.browsing {
  height: 780px;
  padding: 20px;
  background-color: #fff;
}

.el-button {
  width: 90px;
  height: 36px;
  color: #fff;
}
</style>
